<template>
  <div class="app-container">
    <!--工具栏-->
    <div class="head-container">
      <!-- 搜索 -->
      <!-- <label class="el-form-item-label">年</label>
        <el-date-picker v-model="query.year" type="year" placeholder="选择年" value-format="yyyy"> </el-date-picker> -->
      <label class="el-form-item-label">月</label>
      <el-date-picker v-model="query.month" placeholder="选择月" type="month" class="filter-item" value-format="yyyy-MM" @change="changeQuery" />
      <!-- <el-date-picker v-model="query.month" :disabled="!!query.beginDate" placeholder="选择月" type="monthrange" class="filter-item"  range-separator="-" start-placeholder="开始月份" end-placeholder="结束月份" value-format="yyyy-MM-31"> </el-date-picker>  -->
      <!-- <label class="el-form-item-label">季节</label>
        <el-date-picker v-model="query.beginDate" :disabled="!!query.month" type="monthrange" align="right" class="filter-item"   range-separator="-" start-placeholder="开始季节" end-placeholder="结束季节" :picker-options="pickerOptions" > </el-date-picker> -->
      <rrOperation :crud="crud" />
      <el-button type="defalut" icon="el-icon-download" :loading="downloadLoading" style="float: right;" @click="doExport">导出</el-button>
    </div>
    <!--表格渲染-->
    <el-table ref="table" v-loading="listLoading" :data="crud.data" style="width: 100%;">
      <el-table-column :show-overflow-tooltip="true" type="index" label="序号" />
      <el-table-column :show-overflow-tooltip="true" prop="engine" label="考核项目">
        <el-table-column :show-overflow-tooltip="true" prop="engine" label="评分标准">
          <el-table-column :show-overflow-tooltip="true" prop="provincialNum" label="考核排名情况">
            <el-table-column :show-overflow-tooltip="true" prop="provincialNum" label="序号" />
          </el-table-column>

          <el-table-column :show-overflow-tooltip="true" prop="name" label="姓 名" />
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="daily1" label="督查计划">
        <el-table-column :show-overflow-tooltip="true" prop="daily1" label="（10分）">
          <el-table-column :show-overflow-tooltip="true" prop="daily1" label="未列周督查计划1次扣5分；未每半个月全覆盖不得分。">
            <el-table-column :show-overflow-tooltip="true" prop="daily1" label="完成情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="daily" label="日常督查">
        <el-table-column :show-overflow-tooltip="true" prop="daily" label="（40分）">
          <el-table-column :show-overflow-tooltip="true" prop="daily" label="每日开展日常督查，并在工作群内上报不少于10个问题；每少上报一个问题扣0.5分，以此类推。">
            <el-table-column :show-overflow-tooltip="true" prop="daily" label="完成情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="专线对接">
        <el-table-column :show-overflow-tooltip="true" prop="tableName" label="（20分）">
          <el-table-column :show-overflow-tooltip="true" prop="engine" label="开展“十大”专项整治督查，与专线对接文明创建工作；未开展不得分。">
            <el-table-column :show-overflow-tooltip="true" prop="engine" label="完成情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="问题回访">
        <el-table-column :show-overflow-tooltip="true" prop="tableName" label="（30分）">
          <el-table-column :show-overflow-tooltip="true" prop="engine" label="按要求对省、市督查通报、群众反映问题开展举一反三回访；一期未开展扣10分，以此类推。">
            <el-table-column :show-overflow-tooltip="true" prop="engine" label="完成情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="keyPoints" label="督查重点">
        <el-table-column :show-overflow-tooltip="true" prop="keyPoints" label="（加分项）">
          <el-table-column :show-overflow-tooltip="true" prop="keyPoints" label="抓住督查重点，紧盯静态问题整改；日常督查每日通报静态问题加1分，没有则不加分。">
            <el-table-column :show-overflow-tooltip="true" prop="keyPoints" label="加分情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="百分专线">
        <el-table-column :show-overflow-tooltip="true" prop="tableName" label="（加分项）">
          <el-table-column :show-overflow-tooltip="true" prop="engine" label="第三方测评通报百分专线，每条专线加5分。">
            <el-table-column :show-overflow-tooltip="true" prop="engine" label="加分情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="本级督查通报">
        <el-table-column :show-overflow-tooltip="true" prop="tableName" label="（加分项）">
          <el-table-column :show-overflow-tooltip="true" prop="engine" label="每周编辑一期督查通报加1分；每月编辑一期督查专报加5分。">
            <el-table-column :show-overflow-tooltip="true" prop="engine" label="加分情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="上级督查通报">
        <el-table-column :show-overflow-tooltip="true" prop="tableName" label="（扣分项）">
          <el-table-column :show-overflow-tooltip="true" prop="engine" label="省、市日常督查通报问题，每个静态问题扣1分。">
            <el-table-column :show-overflow-tooltip="true" prop="engine" label="扣分情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="上级复查">
        <el-table-column :show-overflow-tooltip="true" prop="tableName" label="（扣分项）">
          <el-table-column :show-overflow-tooltip="true" prop="engine" label="省、市复查通报问题，每个问题扣1分。">
            <el-table-column :show-overflow-tooltip="true" prop="engine" label="扣分情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="上级考核">
        <el-table-column :show-overflow-tooltip="true" prop="tableName" label="（扣分项）">
          <el-table-column :show-overflow-tooltip="true" prop="engine" label="上级反馈问题在规定时间内未整改到位在考核中被扣分的（按中央、省、市三级，每个问题分别扣3/2/1分）">
            <el-table-column :show-overflow-tooltip="true" prop="engine" label="扣分情况" />
          </el-table-column>
        </el-table-column>
      </el-table-column>
      <el-table-column :show-overflow-tooltip="true" prop="tableName" label="总分" />
    </el-table>
    <!--分页组件-->
    <!-- <pagination /> -->
  </div>
</template>

<script>

import crudMonthlyAssessment from '@/api/system/monthlyAssessment'
import CRUD, { presenter, header, crud, form } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import { downloadFile } from '@/utils/index'
import { download } from '@/api/data'
import { getLastDay } from '@/utils/date.js'
const defaultForm = { id: null, name: null, description: null, dictDetails: [] }

export default {
  name: 'GeneratorIndex',
  components: { pagination, crudOperation, rrOperation },
  mixins: [presenter(), header(), form(defaultForm), crud()],
  cruds() {
    const month = new Date().getFullYear() + '-' + (new Date().getMonth() + 1)
    return CRUD({ title: '督查人员月度考核情况表', query: {
      month: month,
      beginDate: month + '-01',
      endDate: month + '-' + getLastDay(month)
    }, url: 'api/tEvent/selectMonthEventCount' })
  },
  data() {
    return {
      query: {},
      queryTypeOptions: [
        { key: 'month', display_name: '月' }
      ],
      list: [],
      downloadLoading: false,
      listLoading: false,
      jidu: '',

      pickerOptions: {
        disabledDate(time) {
          return time.getTime()
        },
        shortcuts: [{
          text: '第一季节',
          onClick(picker) {
            this.jidu = '一季度'
            const start = new Date().getFullYear() + '-' + '01' + '-' + '01'
            const end = new Date().getFullYear() + '-' + '03' + '-' + '31'
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '第二季节',
          onClick(picker) {
            this.jidu = '二季度'
            const start = new Date().getFullYear() + '-' + '04' + '-' + '01'
            const end = new Date().getFullYear() + '-' + '06' + '-' + '30'
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '第三季节',
          onClick(picker) {
            this.jidu = '三季度'
            const start = new Date().getFullYear() + '-' + '07' + '-' + '01'
            const end = new Date().getFullYear() + '-' + '09' + '-' + '30'
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '第四季节',
          onClick(picker) {
            this.jidu = '四季度'
            const start = new Date().getFullYear() + '-' + '10' + '-' + '01'
            const end = new Date().getFullYear() + '-' + '12' + '-' + '31'
            picker.$emit('pick', [start, end])
          }
        }]
      }
    }
  },
  created() {
    this.crud.optShow = { add: false, edit: false, del: false, download: false }
    // this.doList()
  },
  methods: {
    // 钩子：在获取表格数据之前执行，false 则代表不获取数据
    [CRUD.HOOK.beforeRefresh]() {
      return true
    },
    changeQuery() {
      this.query.beginDate = this.query.month + '-01'

      this.query.endDate = this.query.month + '-' + getLastDay(this.query.month)
      this.crud.query = this.query
      // this.doList()
    },
    // doList(){
    //   this.listLoading = true
    //   crudMonthlyAssessment.list(this.query).then((res)=>{
    //   this.listLoading = false
    //   this.list = res
    //   })
    // },
    doExport() {
      const that = this
      // if(!this.jidu&&!this.query.month){return this.$message.info('请选择查询条件')}
      this.downloadLoading = true
      const fileName = this.query.month.split('-')[0] + '年' + this.query.month.split('-')[1] + '月' + '安义县总调度室专业督查人员月度考核情况表'
      download('api/tEvent/downloadMonthEventCount', { ...this.query, strFileName: fileName }).then(result => {
        downloadFile(result, fileName, 'xlsx')
        this.downloadLoading = false
      }).catch(() => {
        this.downloadLoading = false
      })
    }
  }
}
</script>

<style scoped>

</style>
